import React from 'react';

import Drawer from '@material-ui/core/Drawer';
// import AppBar from '@material-ui/core/AppBar';
// import Toolbar from '@material-ui/core/Toolbar';
import List from '@material-ui/core/List';
// import Typography from '@material-ui/core/Typography';
import Divider from '@material-ui/core/Divider';
import IconButton from '@material-ui/core/IconButton';
// import MenuIcon from '@material-ui/icons/Menu';
import ChevronLeftIcon from '@material-ui/icons/ChevronLeft';
// import ChevronRightIcon from '@material-ui/icons/ChevronRight';
import ListItem from '@material-ui/core/ListItem';
import ListItemIcon from '@material-ui/core/ListItemIcon';
import ListItemText from '@material-ui/core/ListItemText';
import InboxIcon from '@material-ui/icons/MoveToInbox';
import MailIcon from '@material-ui/icons/Mail';

export default class MyDrawer extends React.Component {
    constructor(props){
        super(props);
        this.state={
            isOpen:this.props.isOpen?this.props.isOpen:true,
            listItems:[
                '未录入成绩课程', 
                '未录入补考成绩课程',
                '未录入重修成绩课程',
                '历史成绩记录'
            ],
        };
    }




    handleDrawerOpen=()=>{
        //由父组件调用
        this.setState({
            isOpen:true
        });
        //this.props.callback(true);
    }

    handleDrawerClose=()=>{
        //由自身调用
        this.setState({
            isOpen:false
        });
        this.props.callback();
    }


    render() {
        return (

            <Drawer
                variant="persistent"
                anchor="left"
                open={this.state.isOpen}
            >
                <div >
                    <IconButton onClick={this.handleDrawerClose}>
                        <ChevronLeftIcon /> 
                    </IconButton>
                </div>
                <Divider />
                <List>
                    {this.state.listItems.map((text, index) => (
                        <ListItem button key={text}>
                            <ListItemIcon>{index % 2 === 0 ? <InboxIcon /> : <MailIcon />}</ListItemIcon>
                            <ListItemText primary={text} />
                        </ListItem>
                    ))}
                </List>
                
            </Drawer>
        );
    }
}